<template>
  <div class="a-container">
    <div>A组件</div>
    <div>
      <div>count：{{ countStore.count }} </div>
      <div>price: {{ countStore.price }} </div>
      <div>totalPrice: {{ countStore.totalPrice }}</div>
      <button @click="countStore.incCount">count++</button>
    </div>
    <div class="wrap">
      <BCom />
      <CCom />
    </div>
  </div>
</template>

<script setup>
import BCom from './BCom.vue';
import CCom from './CCom.vue';
// 导入store仓库
import useCountStore from './store/module/count';
// 得到一个仓库对象
const countStore = useCountStore()




</script>

<style>
.a-container {
  border: 5px solid #6a3939;
  padding: 6px;
  width: 800px;
  height: 400px;
  margin: 10px auto;
}

.a-container .wrap {
  display: flex;
}
</style>
